<template>
  <div>
    <!-- 面包屑 -->
    <div class="home-breadcrumb">
      <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item >数据挖掘</el-breadcrumb-item>
        <el-breadcrumb-item >设备故障预测分析模型</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="viewShow">
      <!-- header -->
      <view-header :equipStatus = "equipStatus"></view-header>
      <view-table></view-table>
      <div style="width: 100%;display: flex;">
        <polyline-chart :style="{flex:1}"></polyline-chart>
        <schedule-chart :style="{flex:1}"></schedule-chart>
      </div>
    </div>
  </div>
</template>

<script>
  import ViewHeader from './components/viewHeader'
  import ViewTable from './components/viewTable'
  import PolylineChart from './components/PolylineChart'
  import ScheduleChart from './components/scheduleChart'

  import EquipEventApi from '@/api/equipEventApi'
  export default{
    data(){
      return{
        equipStatus:{}
      }
    },
    components:{
      ViewHeader,
      ViewTable,
      PolylineChart,
      ScheduleChart
    },
    created() {
      EquipEventApi.eEquipmentypeStatus().then(res => {
        if(res.data.status === "200"){
          this.equipStatus = res.data.data
        }
      })
    }
  }
</script>

<style scoped="scoped">
  .viewShow{
    /* width: 100%; */
    padding: 10px;
    color: #FFFFFF;
    min-height: 600px;
    /* background-image: url(../../../assets/img/vivid-show.jpg); */
    background-color: rgb(13, 65, 201);
  }
</style>
